<template>
  <hr />
  <h2 style="margin-left: 50px">修改转正信息</h2>
  <hr />
  <el-form
    ref="ruleFormRef"
    style="max-width: 600px"
    :model="ruleForm"
    :rules="rules"
    label-width="auto"
    class="demo-ruleForm"
    :size="formSize"
    status-icon
  >
    <el-form-item label="部门：" prop="departmentName">
      <el-select
        style="width: 180px"
        v-model="ruleForm.departmentName"
        placeholder="全部"
        clearable
        @change="bumen"
      >
        <el-option
          v-for="item in Department"
          :label="item.label"
          :value="item.value"
          :key="item.value"
        />
      </el-select>
    </el-form-item>
    <el-form-item label="职位" prop="postsName" style="width: 280px">
      <el-select v-model="ruleForm.postsName" placeholder="请选择职位" @change="zhiwei">
        <el-option
          v-for="item in Position"
          :label="item.label"
          :value="item.value"
          :key="item.value"
        />
      </el-select>
    </el-form-item>
    <el-form-item label="员工姓名" prop="employeeName" style="width: 400px">
      <el-select v-model="ruleForm.employeeName" placeholder="请选择姓名">
        <el-option
          v-for="item in tableEmployee"
          :label="item.employeeName"
          :value="item.id"
        />
      </el-select>
    </el-form-item>
    <el-form-item label="上级负责人" prop="superstratumCharge" style="width: 280px">
      <el-select v-model="ruleForm.superstratumCharge" placeholder="请选择上级负责人">
        <el-option label="李明" value="李明" />
        <el-option label="张三" value="张三" />
        <el-option label="王五" value="王五" />
      </el-select>
    </el-form-item>
    <el-form-item label="入职日期:" prop="dateonBoard">
      <el-date-picker
        v-model="ruleForm.dateonBoard"
        type="date"
        placeholder="请选择入职日期"
        clearable
        value-format="YYYY-MM-DD"
      />
    </el-form-item>
    <el-form-item label="试用期工作总结:" prop="period">
      <el-input
        v-model="ruleForm.period"
        style="width: 240px"
        :rows="2"
        type="textarea"
        placeholder="请输入试用期工作总结"
      />
    </el-form-item>
    <el-form-item label="对公司的意见和建议:">
      <el-input
        v-model="ruleForm.companySuggestsWords"
        style="width: 240px"
        :rows="2"
        type="textarea"
        placeholder="请填写对公司的意见和建议"
      />
    </el-form-item>
    <el-form-item label="审批备注">
      <el-input
        v-model="form.remarks"
        style="width: 240px"
        :rows="2"
        type="textarea"
        placeholder="请输入备注信息"
      />
    </el-form-item>
    <el-form-item label="转批人">
      <el-select v-model="form.superstratumCharge" placeholder="请选择转批人">
        <el-option v-for="item in tableUser" :label="item.name" :value="item.name" />
      </el-select>
    </el-form-item>
    <el-form-item>
      <el-button type="primary" @click="Pass((xid = 1))">通过并转批</el-button>
      <el-button @click="Pass((xid = 2))">拒绝</el-button>
      <el-button @click="Pass((xid = 3))">通过并终止转批</el-button>
    </el-form-item>
  </el-form>
</template>

<script lang="ts" setup>
import { reactive, ref,onMounted } from 'vue'
import { ElMessage, type ComponentSize, type FormInstance, type FormRules } from 'element-plus'
import axios from 'axios';
import { useRouter,useRoute } from 'vue-router';
const router=useRouter();
const route=useRoute();
onMounted(()=>{
  GetModel();
  GetUser()
})
const formSize = ref<ComponentSize>('default')
const ruleFormRef = ref<FormInstance>()
const ruleForm = reactive({
  regularizationId:route.query.id,
  departmentName: "",
  postsName: "",
  employeeName: "",
  superstratumCharge: "",
  dateonBoard: "",
  period: "",
  companySuggestsWords: "",
  createName:"",
  createDate:"",
  firmId:"",
  userId:""
})
const Department = ref([
    { label: 'CEO', value: 1 },
    { label: '财务部', value: 2 },
    { label: '运营部', value: 3 },
    { label: '人事部', value: 4 },
    { label: '策划部', value: 5 },
])

const Positions = ref([
    { label: '董事长', value: 1},
    { label: '财务部长', value: 2},
    { label: '运营部长', value: 3},
    { label: '人事部长', value: 4},
    { label: '策划部长', value: 5},
])
const Position=ref([]);
const bumen=(id:number)=>{
  Position.value = Positions.value.filter(positions => positions.value == id);
  const selectedPosition = Department.value.find(position => position.value === id);
    if (selectedPosition) {
      ruleForm.departmentName = selectedPosition.label;
    }
}
const zhiwei=(id:number)=>{
  const selectedPosition = Positions.value.find(position => position.value === id);
    if (selectedPosition) {
        ruleForm.postsName = selectedPosition.label;
    }
    GetemployeeName();
}
const locationOptions = ['Home', 'Company', 'School']

const rules = reactive<FormRules>({
  employeeName: [
    {
      required: true,
      message: '请选择员工姓名',
      trigger: 'change',
    },
  ],
  departmentName: [
    {
      required: true,
      message: '请选择部门',
      trigger: 'change',
    },
  ],
  postsName: [
    {
      required: true,
      message: '请选择职位',
      trigger: 'change',
    },
  ],
  superstratumCharge: [
    {
      required: true,
      message: '请选择上级负责人',
      trigger: 'change',
    },
  ],
  dateonBoard: [
    { required: true, message: '入职日期为必填项', trigger: 'blur' },
  ],
  period: [
    { required: true, message: '试用期工作总结为必填项', trigger: 'blur' },
  ]
})
const tableEmployee=ref([]);
///员工姓名
const GetemployeeName=()=>{
  axios({
    method:"get",
    url:"empread/api/Employee/EmployeeshowEntry",
    params:{
      postsId:ruleForm.postsName
    }
  })
  .then(res=>{
    tableEmployee.value=res.data.data
  })
}

const GetModel=()=>{
    axios({
        method:"get",
        url:"empread/api/Regularization/GetRegularizationById",
        params:{
            id:ruleForm.regularizationId
        }
    })
    .then(res=>{
      GetemployeeName();
        ruleForm.employeeName=res.data.data.employeeName
        ruleForm.departmentName=res.data.data.departmentName
        ruleForm.postsName=res.data.data.postsName
        ruleForm.superstratumCharge=res.data.data.superstratumCharge
        ruleForm.dateonBoard=res.data.data.dateonBoard
        ruleForm.period=res.data.data.period
        ruleForm.companySuggestsWords=res.data.data.companySuggestsWords
        ruleForm.createName=res.data.data.createName
        ruleForm.createDate=res.data.data.createDate
        ruleForm.firmId=res.data.data.firmId
        ruleForm.userId=res.data.data.userId
    })
}
const tableUser=ref([])
const GetUser = () => {
    axios({
        method: "get",
        url: "http://47.96.109.219:5202/api/User/UserSelectShow"
    })
        .then(res => {
            tableUser.value = res.data.data
        })
}
let xid=0;
const form = reactive({
    "nameId": route.query.employeeNameId,
    "remarks": "",
    "personnelId": route.query.id,
    "field": xid,
    "superstratumCharge": "",
    tableName:"转正"
})

const Pass = (id: number) => {
    console.log()
    axios.post("empwrite/api/LoginUpdate/LoginUpdateRegularization", {
        nameId: route.query.employeeNameId,
        remarks: form.remarks,
        personnelId: route.query.id,
        field: id,
        superstratumCharge: form.superstratumCharge,
        tableName:"转正"
    })
        .then(res => {
            if (res.data.data > 0) {
                router.push({
                    name: "RegularizationShow"
                })
            }
            else {

            }
        })
}
</script>
